<template>
    <div>
        <div>===============================VueUse组件=================================</div>
        <div>具体功能查看VueUse官网，此处只是演示如何通过CDN方式引入，并解决ts判定问题</div>
        <div>{{ x }}</div>
        <div>{{ y }}</div>
        <button @click="getUseMouse">获取鼠标坐标</button>
    </div>
</template>

<script setup lang="ts">
// import{useMouse} from "@vueuse/core"
import { onMounted, ref } from 'vue';
const x = ref(0)
const y = ref(0)

function getUseMouse() {
     x.value = window.VueUse.useMouse().x
     y.value = window.VueUse.useMouse().y
    console.log(window.VueUse.useMouse())
    console.log(x,y)
}
// import { useMouse } from "@vueuse/core"
// onMounted(() => {
//     console.log(window.VueUse.useMouse())
// })
</script>

<style>
</style>